<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link href="../favicon.ico" rel="shortcut icon" type="image/x-icon">
<title>JSON Parser for Blogger Posts and Pages</title>
</head>
<body>

<div id="result-container">Loading&hellip;</div>
<script>

function generatePostsData(json) {

    // Poor configuration settings, develop them yourself!
    var config = {
        containerID: 'result-container', // Container ID to show the generated data
        avatarSize: 50, // Default avatar size
        noThumbnail: '',
        text: {
            anon: 'Anonymous',
            untagged: 'Untagged',
            monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
        }
    };

    var html = "",
        item = "",
        w = window,
        d = document,
        feed = json.feed,
        container = d.getElementById(config.containerID),
        postTotal = +feed.openSearch$totalResults.$t, // The post/page feeds' total (all)
        postStartIndex = +feed.openSearch$startIndex.$t, // The post/page feeds' start index
        postPerPage = +feed.openSearch$itemsPerPage.$t, // The post/page feeds' max results per page or per feed request
        blogID = /\:blog-?(\d+)(\.|$)/.exec(feed.id.$t) ? /\:blog-?(\d+)(\.|$)/.exec(feed.id.$t)[1] : false, // The blog ID
        blogTitle = feed.title.$t, // The post/page feeds' title
        blogTags = false, // The available post/page tags (all)
        blogSubTitle = feed.subtitle.$t, // The post/page feeds' subtitle
        blogAuthorName = feed.author[0].name ? feed.author[0].name.$t : config.text.anon, // The blog/post author name
        blogAuthorAvatar = feed.author[0].gd$image.src.replace(/\/s\d+(\-c)?\//, '/s' + config.avatarSize + '-c/'), // The blog/post author profile avatar URL
        blogGeneratorName = feed.generator.$t, // The blog generator name (Blogger)
        blogGeneratorURL = feed.generator.uri; // The blog generator URL (http://www.blogger.com)

    // Remove the leading `http://` or `https://` in blog/post author profile avatar URL
    blogAuthorAvatar = blogAuthorAvatar.replace(/^https?\:/, "");

    // No container found
    if (!container) {
        alert('Container not found.');
        return;
    }

    // Getting the blog tags
    if (feed.category && feed.category.length) {
        blogTags = [];
        for (var h = 0, hen = feed.category.length; h < hen; ++h) {
            blogTags.push(feed.category[h].term);
        }
        // Sort the blog tags alphabetically
        blogTags = blogTags.sort();
    }

    // No posts/pages yet
    if (!feed.entry || feed.entry.length === 0) {
        container.innerHTML = '<p>No posts/pages yet.</p>';
        return;
    }

    // Building the markup ...
    html += '<h1>' + blogTitle + '</h1>';
    html += '<h2>' + blogSubTitle + '</h2>';
    html += '<p><b>Blog ID:</b> ' + blogID + '</p>';
    html += '<p><b>Blog Tags:</b> ' + (blogTags !== false ? blogTags.join(', ') : config.text.untagged) + '</p>';
    html += '<p><b>Blog Author Name:</b> ' + blogAuthorName + '</p>';
    html += '<p><b>Blog Author Avatar URL:</b> ' + blogAuthorAvatar + '</p>';
    html += '<p><b>Total Posts:</b> ' + postTotal + '</p>';
    html += '<p><b>Posts Per Page:</b> ' + postPerPage + '</p>';
    html += '<p><b>Posts Start Index:</b> ' + postStartIndex + '</p>';
    html += '<hr>';
    html += '<ol>';

    var posts = feed.entry;

    for (var i = 0, ien = posts.length; i < ien; ++i) {
    
        var post = posts[i], // A single post/page object
            postID = post.id.$t, // The post/page ID
            postPublish = post.published.$t, // The post/page publishing time in ISO format
            postUpdate = post.updated.$t, // The post/page updating time in ISO format
            postDate = postPublish, // The post/page publishing time in human-readable format
            postURL = false, // The post/page URL
            postTags = false, // The post/page tags
            postCommentTotal = post.thr$total ? +post.thr$total.$t : 0, // The post/page comments total
            postCommentFeedURL = false, // The post/page comments feed URL
            postThumbnail = post.media$thumbnail ? post.media$thumbnail.url : config.noThumbnail, // The post/page thumbnail
            postAuthorName = post.author[0].name ? post.author[0].name.$t : config.text.anon, // The post/page author name
            postAuthorURL = post.author[0].uri ? post.author[0].uri.$t : false, // The post/page author profile URL
            postAuthorAvatar = post.author[0].gd$image.src.replace(/\/s\d+(\-c)?\//, '/s' + config.avatarSize + '-c/'), // The post/page author profile avatar URL
            postTitle = post.title.$t, // The post/page title
            postContent = post.content ? post.content.$t : post.summary.$t.replace(/<br *\/?>|[\s]+/gi, ' ').replace(/<.*?>|[<>]/g, ""), // The post/page content
            postEditURL = false; // The post/page edit URL

        // Generate human-readable post/page date format
        var date = postDate.split('T')[0].split('-');
        postDate = date[2] + ' ' + config.text.monthNames[(+date[1]) - 1] + ' ' + date[0];

        // Remove the leading `http://` or `https://` in post/page thumbnail URL
        postThumbnail = postThumbnail.replace(/^https?\:/, "");

        // Remove the leading `http://` or `https://` in post/page author profile avatar URL
        postAuthorAvatar = postAuthorAvatar.replace(/^https?\:/, "");

        for (var j = 0, jen = post.link.length; j < jen; ++j) {
            item = post.link[j];
            if (item.rel == 'self') {
                // Getting the original post/page ID
                postID = item.href.split('/').pop();
                // Getting the post/page edit URL
                postEditURL = item.href.replace(/\/feeds\/(\d+)\/(post|page)s?\/(default|summary)\/(\d+)/, '/$2-edit.g?blogID=$1&$2ID=$4');
            }
            // Getting the post/page URL
            if (item.rel == 'alternate') {
                postURL = item.href;
            }
            // Getting the post/page comment feed URL
            if (item.rel == 'replies' && item.type == 'application/atom+xml') {
                postCommentFeedURL = item.href;
            }
        }

        // Trying to get the external image URL from post/page content
        if (post.content && postThumbnail == config.noThumbnail) {
            var image = /<img +(.*?)src=(['"])([^'"]+?)(['"])(.*?) *\/?>/i.exec(post.content.$t);
            postThumbnail = image && image[3] ? image[3] : config.noThumbnail;
        }

        // Getting the post/page tags
        if (post.category && post.category.length) {
            postTags = [];
            for (var k = 0, ken = post.category.length; k < ken; ++k) {
                postTags.push(post.category[k].term);
            }
            // Sort the post/page tags alphabetically
            postTags = postTags.sort();
        }

        // Building the markup ...
        html += '<li>';
        html += '<p><b>ID:</b> ' + postID + '</p>';
        html += '<p><b>Publish:</b> ' + postPublish + '</p>';
        html += '<p><b>Update:</b> ' + postUpdate + '</p>';
        html += '<p><b>Date:</b> ' + postDate + '</p>';
        html += '<p><b>URL:</b> ' + postURL + '</p>';
        html += '<p><b>Tags:</b> ' + (postTags !== false ? postTags.join(', ') : config.text.untagged) + '</p>';
        html += '<p><b>Comment Total:</b> ' + postCommentTotal + '</p>';
        html += '<p><b>Comment Feed URL:</b> ' + postCommentFeedURL + '</p>';
        html += '<p><b>Thumbnail:</b> ' + postThumbnail + '</p>';
        html += '<p><b>Author:</b> ' + postAuthorName + '</p>';
        html += postAuthorURL !== false ? '<p><b>Author URL:</b> ' + postAuthorURL + '</p>' : "";
        html += '<p><b>Author Avatar URL:</b> ' + postAuthorAvatar + '</p>';
        html += '<p><b>Edit URL:</b> ' + postEditURL + '</p>';
        html += '<p><b>Title:</b> ' + postTitle + '</p>';
        html += '<p><b>Content:</b></p>';
        html += '<div>' + postContent + '</div>';
        html += '</li>';

    }

    // Building the markup ...
    html += '</ol>';

    // Show the generated data to the container ...
    container.innerHTML = html;

}

</script>
<script src="http://dte-feed.blogspot.com/feeds/posts/default?alt=json-in-script&amp;orderby=published&amp;max-results=10&amp;callback=generatePostsData"></script>

</body>
</html>